<template>
	<view>
		<view class="">
			<!-- 2.0.19支持autoBack，默认为false -->
			<u-navbar leftText="一键开门" :autoBack="true" bgColor="#f8f8f8">
			</u-navbar>
		</view>
		<view class="con-body">
			<view style="padding:20rpx;">
				<view style="font-size: 40rpx;font-weight: bold;">
					选择您要打开的门禁
				</view>
				<view style="font-size: 26rpx;color:#999;line-height: 45rpx;padding:20rpx 0;">为方便后续身份验证，请在“我的房屋”和“我的家庭”中预留您和您家人的信息</view>
				
				<view class="door_list" @click="toonekey">
					<view style="width:86%;margin-left:7%;padding:40rpx 0;">
						<view style="font-size: 32rpx;margin-bottom:20rpx;font-weight: bold;">龍舟一号院大门门禁</view>
						<view>点击进入</view>
					</view>
					
				</view>
				<view class="door_list door_list1" v-for="(item,index) in doorlist" :key="index">
					<view style="width:86%;margin-left:7%;padding:40rpx 0;">
						<view style="font-size: 32rpx;margin-bottom:20rpx;font-weight: bold;">{{item.title}}</view>
						<view>点击进入</view>
					</view>
					
				</view>
			</view>
			<view class="bottom_con">龙海智慧物业门禁系统</view>
		</view>
		
		<u-popup :show="showMemo" mode="center" :round="10" :zoom="false" :closeable="true" @close="showMemo=false">
			<view class="p_con">
				<image style="width:100%;" mode="widthFix" src="https://resourse.cnlhjt.com/upload/20220929/824cab16846b5e9dfa5d7ec2b301ae7f.png"></image>
				<!-- <view class="title">温馨提示</view> -->
				<view class="p_content">您还未进行身份验证，请前往“我的房屋”和“我的家庭”中预留您和您家人的信息</view>
				<view class="isee">前往验证</view>
				<view style="text-align: center;" @click="showMemo=false">取消</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data () {
			return {
				doorlist:[
					{
						id:1,
						title:'龍舟·壹号院1期2号楼3单元'
					},
					{
						id:2,
						title:'龍舟·壹号院1期2号楼3单元'
					}
				],
				showMemo:true
			}
		},
		methods:{
			toonekey(){
				uni.navigateTo({
					url:'./onekey'
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f8f8f8;
	}
	.door_list{
		width:100%;
		height:180rpx;
		color:#fff;
		font-size: 22rpx;
		margin-bottom:30rpx;
		background-image: url('https://resourse.cnlhjt.com/upload/20220928/ddf6aa5fa1395ca297d6e159a44e8ee6.jpg');
		border-radius: 20rpx;
		background-size: 100% 100%;
		background-position: center center;
	}
	.door_list1{
		background-image: url('https://resourse.cnlhjt.com/upload/20220928/4b054f1c0c339aeb97a56b7695af1cd7.jpg');
	}
	.bottom_con{
		position: fixed;
		bottom:40rpx;
		width:100%;
		color:#00828A;
		text-align: center;
	}
	
	.p_con{
		width:600rpx;
		border-radius: 20rpx;
		overflow: hidden;
		
		.title{
			padding:20rpx 0;
			text-align: center;
			font-size: 32rpx;
			font-weight: bold;
		}
		.p_content{
			font-size: 26rpx;
			color:#333;padding:20rpx 30rpx 20rpx;
		}
		.isee{
			width:90%;
			margin:20rpx 0 30rpx;
			margin-left:5%;
			height:70rpx;
			line-height: 70rpx;
			text-align: center;
			color:#fff;
			border-radius: 35rpx;
			// background-color: #333;
			background-size: 100% 80rpx;
			background-image: url('https://resourse.cnlhjt.com/upload/20220825/d1aa35c1d129137d9b12c8f34e59c5bc.png');
		}
	}
</style>